import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

// 引入主体区域三个文件
import 'HomeBody.dart';
import '../list/MovieList.dart';
import '../cinema/CinemaList.dart';


class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    // 默认提供一个控制器，来控制我们的页面切换，需要两个必传项，一个child，一个length，
    // length 指我们需要控制的导航item项的数量，而且必须是页面数量和导航item项数量一致
    return DefaultTabController(
      length: 3,
      // 脚手架工具 提供很多默认的组件供我们调用
      child: Scaffold(
        // 头部导航  AppBar()是Scaffold 内部提供的导航
        appBar: AppBar(
          title: Text('珠峰影院'),
          centerTitle: true,
          actions: <Widget>[
            // 添加我们需要的图标
            IconButton(
              icon: Icon(Icons.search),
              onPressed: (){},
            )
          ],
        ),

        // 侧边栏, 也是脚手架工具提供给我们的
        drawer: Drawer(
          // ListView是一个垂直排列的容器
          child: ListView(
            // 手动添加padding 为0, 去掉侧边栏默认的内间距
            padding: EdgeInsets.all(0),
            children: <Widget>[
              // Drawer 顶部区域
              UserAccountsDrawerHeader(
                accountName: Text('心_语'),
                accountEmail: Text('12345678@qq.com'),
                // 装饰器
                decoration: BoxDecoration(
                  image: DecorationImage(
                    // 是图片平铺在我们的容器里面。这是方式对图片没有拉伸，但是会裁切
                    fit: BoxFit.cover,
                    image: NetworkImage(
                        'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1565519039005&di=c5e788e9d717b63bb865b50fcf2dd855&imgtype=0&src=http%3A%2F%2Fi9.hexun.com%2F2018-11-24%2F195299307.jpg'),
                  ),
                ),
                // 添加个人头像
                currentAccountPicture: CircleAvatar(
                  backgroundImage: NetworkImage(
                      'https://upload.jianshu.io/users/upload_avatars/12442310/e11b2581-d89e-406e-95bc-5e1421066549.jpg?imageMogr2/auto-orient/strip|imageView2/1/w/240/h/240'),
                ),
              ),

              // 一个一个的侧边栏纵向排列的 item项
              ListTile(title: Text('我的发布'), trailing: Icon(Icons.send)),
              ListTile(title: Text('我的收藏'), trailing: Icon(Icons.feedback)),
              ListTile(title: Text('系统设置'), trailing: Icon(Icons.settings)),
              Divider(color: Colors.black),
              ListTile(title: Text('注销'), trailing: Icon(Icons.exit_to_app)),
            ],
          ),
        ),


        // homepage 主体中间区域的页面切换
        body: TabBarView(
          children: <Widget>[
            HomeBody(),
            MovieList(),
            CinemaList()
          ],
        ),


        // 底部导航
        // 默认需要一个controller控制器,把我们的页面和底部导航绑定到一起，实现无缝切换
        // 一般来说，需要添加自定义的属性时，并且我们的系统组件不能传参，那么我们就在外层套上一个 Container 盒子容器，在里面添加我们的自定义效果
        bottomNavigationBar: Container(
          // 装饰器, 添加导航的颜色
          decoration: BoxDecoration(
            color: Colors.black
          ),
          height: 50,
          child: TabBar(
            labelStyle: TextStyle(
              height: 0,
              fontSize: 10
            ),
            tabs: <Widget>[
              Tab(text: '首页', icon: Icon(Icons.home)),
              Tab(text: '正在热映', icon: Icon(Icons.movie_creation)),
              Tab(text: '影院信息', icon: Icon(Icons.movie_filter)),
            ],
          ),
        ),
      ),
    );
  }
}
